<template>
    <view>
        <form @reset="formReset" @submit="formSubmit" :reportSubmit="true">
            <view class="main" :style="'background:' + color">
                <view class="top">
                    <view class="pdxh1" style="color: #999; text-align: center">{{ NumberDetail.num }}</view>
                    <view class="pdxh1" :style="'color:' + color">排队序号</view>
                    <view class="pdxh2" :style="'color:' + color">{{ NumberDetail.code }}</view>
                    <view class="pdxh3" :style="'color:' + color">前方等待人数：{{ NumberDetail.wait }}</view>
                </view>
                <view class="xx">
                    <view class="hyuan1" :style="'background:' + color"></view>
                    <view class="hyuan2" :style="'background:' + color"></view>
                </view>
                <view class="bottom" :style="'border-color:' + color">
                    <view>{{ storeinfo.address }}</view>
                    <view @tap="seller_info" class="flex-row flex-y-center cxqh" :style="'background:' + color">
                        <image mode="aspectFit" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/location.png"></image>
                        <view>前往商家</view>
                    </view>
                    <view class="weui-cells weui-cells_after-title sjxx">
                        <view class="weui-cell weui-cell_access" hoverClass="weui-cell_active">
                            <view class="weui-cell__hd">
                                <image mode="aspectFit" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/seller/xiuxi.png"></image>
                            </view>
                            <view class="weui-cell__bd">取号时间：</view>
                            <view class="weui-cell__ft">{{ NumberDetail.time }}</view>
                        </view>
                        <navigator class="weui-cell weui-cell_access" hoverClass="weui-cell_active" url="infomation">
                            <view class="weui-cell__hd">
                                <image mode="aspectFit" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/personal/intergal.png"></image>
                            </view>
                            <view class="weui-cell__bd">商家环境</view>
                            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
                        </navigator>
                        <view @tap="maketel" class="weui-cell weui-cell_access" hoverClass="weui-cell_active">
                            <view class="weui-cell__hd">
                                <image mode="aspectFit" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/seller/tel.png"></image>
                            </view>
                            <view class="weui-cell__bd">商家电话：</view>
                            <view class="weui-cell__ft weui-cell__ft_in-access">{{ storeinfo.tel }}</view>
                        </view>
                    </view>
                    <view class="footer">
                        <button formType="submit" :style="'background:' + color">取消排号</button>
                    </view>
                </view>
            </view>
        </form>
        <button @tap="refresh" class="hddb">
            <image src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/shuaxin.png"></image>
        </button>
    </view>
</template>

<script>
import cardlist from '@/ymq_canyino2o/dist/cardlist/index';
import gettel from '@/ymq_canyino2o/dist/gettel/index';
var app = getApp();
var util = require('../../utils/util.js');
export default {
    components: {
        cardlist,
        gettel
    },
    data() {
        return {
            id: '',

            storeinfo: {
                address: '',
                tel: ''
            },

            NumberDetail: {
                num: '',
                code: '',
                wait: '',
                time: ''
            },

            color: ''
        };
    },
    onLoad: function (t) {
        console.log(t);
        uni.setNavigationBarTitle({
            title: '排队详情'
        });
        var that = this;
        that.setData({
            id: t.id
        });
        app.globalData.setNavigationBarColor(this);
        app.globalData.getimgUrl(this);
        app.globalData.getUserInfo(function (t) {
            console.log(t);
        });
        app.globalData.util.request({
            url: 'entry/wxapp/StoreInfo',
            cachetime: '0',
            data: {
                store_id: t.storeid
            },
            success: function (t) {
                console.log(t.data);
                that.setData({
                    storeinfo: t.data.store
                });
            }
        });
        this.reLoad();
    },
    onReady: function () {},
    onShow: function () {},
    onHide: function () {},
    onUnload: function () {},
    onPullDownRefresh: function () {
        this.reLoad();
        uni.stopPullDownRefresh();
    },
    onReachBottom: function () {},
    methods: {
        reLoad: function () {
            var that = this;
            app.globalData.util.request({
                url: 'entry/wxapp/NumberDetails',
                cachetime: '0',
                data: {
                    num_id: that.id
                },
                success: function (t) {
                    console.log(t.data);
                    that.setData({
                        NumberDetail: t.data
                    });
                }
            });
        },

        seller_info: function (t) {
            var e = this.storeinfo.coordinates.split(',');
            var o = this.storeinfo;
            console.log(e);
            uni.openLocation({
                latitude: parseFloat(e[0]),
                longitude: parseFloat(e[1]),
                address: o.address,
                name: o.name
            });
        },

        maketel: function () {
            uni.makePhoneCall({
                phoneNumber: this.storeinfo.tel
            });
        },

        refresh: function () {
            uni.startPullDownRefresh({});
        },

        formSubmit: function (t) {
            var that = this;
            var o = uni.getStorageSync('users').id;
            app.globalData.util.request({
                url: 'entry/wxapp/AddFormId',
                cachetime: '0',
                data: {
                    user_id: o,
                    form_id: t.detail.formId
                },
                success: function (t) {
                    console.log(t.data, o);
                }
            });
            uni.showModal({
                title: '提示',
                content: '确定取消排号吗？',
                success: function (t) {
                    if (t.cancel) {
                        return true;
                    }
                    if (t.confirm) {
                        uni.showLoading({
                            title: '操作中'
                        });
                        app.globalData.util.request({
                            url: 'entry/wxapp/DelNumber',
                            cachetime: '0',
                            data: {
                                num_id: that.id
                            },
                            success: function (t) {
                                console.log(t.data);
                                if (t.data) {
                                    uni.showToast({
                                        title: '取消成功',
                                        icon: 'success',
                                        mask: true,
                                        duration: 1000
                                    });
                                    setTimeout(function () {
                                        uni.redirectTo({
                                            url: 'getnum?storeid=' + that.storeinfo.id
                                        });
                                    }, 1000);
                                } else {
                                    uni.showToast({
                                        title: '请重试',
                                        icon: 'loading',
                                        duration: 1000
                                    });
                                }
                            }
                        });
                    }
                }
            });
        },

        formReset() {
            console.log('占位：函数 formReset 未声明');
        }
    }
};
</script>
<style>
@import './getnumdl.css';
</style>
